<template>
  <div>
    <div class="app-container">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane v-for="item in tabsList" :key="item.name" :label="item.label" :name="item.name"></el-tab-pane>
      </el-tabs>
    </div>
    <component :is="activeName" :isOrderTaker="true"></component>
  </div>
</template>

<script>
import maintenance from '@/views/houseManagement/workOrder/maintenance/index.vue'
// import attendant from '@/views/houseManagement/workOrder/attendant/index.vue'
import cleaner from '@/views/houseManagement/workOrder/cleaner/index.vue'

export default {
  name: 'Index',
  dicts: ['work_order_state', 'maintenance_type'],
  components: {
    maintenance,
    // attendant,
    cleaner
  },
  data() {
    return {
      // 选中项
      activeName: 'maintenance',
      // 选项列表
      tabsList: [
        {
          name: 'maintenance',
          label: '报修工单'
        },
        // {
        //   name: 'attendant',
        //   label: '看房工单'
        // },
        {
          name: 'cleaner',
          label: '保洁工单'
        }
      ],
    }
  },
  computed: {
  },
  watch: {},
  created() {
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event)
      this.activeName = tab.name
    }
  }
}
</script>

<style lang="scss" scoped></style>
